import React from 'react'
import { CascadePickerView, } from 'antd-mobile-v5'

import './index.scss'

type Props = {
  filterData: any,
  name: string,
  selectedValue: any,
  defaultValue: any,
  onSubmit: any,
  onCancel: any
}

export default class FilterPicker extends React.Component<Props> {
  state = {
    value: this.props.defaultValue
  }

  // 确定
  // onSubmit = ():any => {
  //   console.log(this.state.value)
  // }
  
  render() {
    let data = []
    switch (this.props.name) {
      case 'area':
        data = this.props.filterData.area
        break
      case 'mode':
        data = this.props.filterData.mode
        break
      case 'price':
        data = this.props.filterData.price
        break
      default:
        break
    }
    return (
      <>
        <CascadePickerView value={this.state.value} options={data} onChange={val => {
          this.setState({
            value: val
          })
        }}/>
        <div className='filterBottom flex_x_b'>
          <div className='cancel' onClick={() => this.props.onCancel(this.props.name)}>取消</div>
          <div className='submit' onClick={() => this.props.onSubmit(this.state.value)}>确定</div>
        </div>
      </>
      
    )
  }
  
}